<!DOCTYPE html>
<html lang="en"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>monitorIndexPage</title>
    <link rel="stylesheet" type="text/css" th:href="@{/css/themes/default/easyui.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/css/themes/icon.css}">
    <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/jquery.easyui.min.js}"></script>
    <style type="text/css" title="currentStyle" media="screen" mce_bogus="1">
        .divcenter{
            position:absolute;/*层漂浮*/
            top:35%;
            left:35%;
            width:30%;
            height:30%;
            /* background:yellow;   */
             border:1px solid red;
        }
    </style>
</head>
<body>
<!-- 顶部菜单导航，用户信息栏-->
<div th:replace="baseHeader::baseheader"></div>
<div class="center" style="width:100%;margin-top: 5px">
    <div class="opt">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" onclick="fnAddMonitorObj()">新增</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onclick="fnUpdateMonitorObjRunstatus('monitoring')">启动</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-no" onclick="fnUpdateMonitorObjRunstatus('stop')">暂停</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-clear" onclick="removeMonitorObj()">删除</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit"  onclick="editMonitorObj()">编辑</a>
    </div>
    <table id="dg_monitorObj" class="easyui-datagrid" title="监视对象列表" style="width:100%;height:600px"
           data-options="singleSelect:true,collapsible:true,url:'getMonitorObjList',method:'get',pagination:true,pageSize:10,pageNumber:1">
        <thead>
        <tr>
            <th data-options="field:'monitorobjId',width:'15%' ,align:'center'">监视对象Id</th>
            <th data-options="field:'monitorobjName',width:'20%' ,align:'center'">监视对象</th>
            <th data-options="field:'monitorobjType',width:'10%' ,align:'center'">监视对象类型</th>
            <th data-options="field:'creatTime',width:'15%' ,align:'center'">创建时间</th>
            <th data-options="field:'lastaccessTime',width:'15%' ,align:'center'">上次连接时间</th>
            <th data-options="field:'monitorobjStatus',width:'5%' ,align:'center'">状态</th>
            <th data-options="field:'monitorobjCodeId',width:'10%' ,align:'center'">检测程序</th>
            <th data-options="field:'runStatus',width:'10%' ,align:'center'">运行状态</th>
            <!--<th data-options="field:'opr',width:'15%' ,align:'center',formatter:formatOpr">操作</th>-->
        </tr>
        </thead>
    </table>
</div>

<!-- 编辑监视对象信息-->
<div class="easyui-dialog" id="editMonitorWin" title="editMonitorObj" style="width:500px;height:400px;padding:10px">
    <div  th:replace="editMonitor::editMonitor" style="height: 100%;width: 100%"></div>
</div>
<!--<div id="editMonitorWin" style="display: none;" class="divcenter">
    <div  th:replace="editMonitor::editMonitor" style="height: 100%;width: 100%"></div>
</div>-->

</body>
</html>
<script>
    $(document).ready(function() {
        $('#editMonitorWin').dialog('close')
    })

    function fnAddMonitorObj(){
        console.log("新增")
        $('#editMonitorWin').dialog('open');
        $('#ff').form('load',{
            monitorobjId:""
        });
    }

    function fnUpdateMonitorObjRunstatus(runstatus) {
        console.log("更新runstatus")
        var row = $('#dg_monitorObj').datagrid('getSelected');
        if(row){
            $.ajax({
                url:'updateMonitorObj',
                method:"post",
                data:{
                    monitorobjId:row.monitorobjId,
                    runStatus:runstatus
                },
                success:function(data){
                    alert('更新状态成功！');
                    reloadGrid()
                }
            });
        }else {
            alert('请先选择一行');
        }
    }

    function removeMonitorObj(){
        console.log("删除")
        var row = $('#dg_monitorObj').datagrid('getSelected');
        if(row){
            $.messager.confirm('删除操作确认', '确定执行删除操作吗?', function(r){
                if (r){
                    $.ajax({
                        url:'removeMonitorObj',
                        method:"post",
                        data:{
                            monitorobjId:row.monitorobjId,
                        },
                        success:function(data){
                            alert('删除成功！');
                            reloadGrid()
                        }
                    });
                }
            })
        }else {
            alert('请先选择一行');
        }
    }

    function editMonitorObj(){
        console.log("编辑")
        var row = $('#dg_monitorObj').datagrid('getSelected');
        if (row){
            $('#editMonitorWin').dialog('open');
            $('#ff').form('load',{
                monitorobjId:row.monitorobjId,
                monitorobjName:row.monitorobjName,
                monitorobjType:row.monitorobjType,
                creatTime:row.creatTime,
                monitorobjCodeId:row.monitorobjCodeId
            });
            //$("#monitorobjCodeId").combobox('setValue',row.monitorobjCodeId);
        }else{
            alert('请先选择一行');
        }
    }

    /*function formatOpr(val,row,index) {
        return '<a href="javascript:void(0)" onclick="editMonitorObj()" >编辑</a>'
    }*/

    function reloadGrid() {
        $('#dg_monitorObj').datagrid('reload');
    }

</script>
